<template>
	<view>
		<cu-custom :bgLiner="true" :isBlack="false">
			<block slot="content">餐厅详情</block>
		</cu-custom>
		<view class="position-rel z-i-1">
			<view class="circle-orange"></view>
			<view class="position-rel z-i-2 contents">
				<image src="/static/img/log-bg.png" class="top-img"></image>
				<view class="p-l-15 p-r-15 position-rel m-b-25">
					<view class="restaurant-desc ">
						<view class="orange f-16 fontBold">
							{{info.name}}
						</view>
						<view class="flex align-center justify-space-between m-t-5">
							<view class="f-12 fontBold">
								地址{{info.address}}
							</view>
							<!-- <view class="flex align-center">
								<image src="/static/img/local.png" class="local"></image>
							</view> -->
						</view>
						<view class="f-12 m-t-5 fontBold">
							厨师：{{chef_str}}
						</view>
					</view>
				</view>
				<view class="wrap m-t-15">
					<view class="f-16 fontBold orange">
						餐厅描述
					</view>
					<view class="black-9 m-t-5">
						<view v-html="info.describe"></view>
					</view>
				</view>
				<view class="wrap m-t-15">
					<view class="f-16 fontBold orange">
						餐厅简介
					</view>
					<view class="black-9 m-t-5">
						<view v-html="info.introduce"></view>
					</view>
				</view>
				<view class="wrap m-t-15">
					<view class="f-16 fontBold orange">
						营业执照
					</view>
					<view class=" m-t-10" @click="preImg([info.business_license],0)">
						<image :src="info.business_license" mode="aspectFit"></image>
					</view>
				</view>
				<view class="wrap m-t-15">
					<view class="f-16 fontBold orange">
						餐饮许可证
					</view>
					<view class=" m-t-10" @click="preImg([info.catering_license],0)">
						<image :src="info.catering_license" mode="aspectFit"></image>
					</view>
				</view>
				<view class="wrap m-t-15">
					<view class="f-16 fontBold orange">
						银行账户信息
					</view>
					<view class="black-9 m-t-5">
						{{info.bank_account_information}}
					</view>
				</view>
			</view>
		</view>
		
		<view style="height: 130rpx;"></view>
		<view class="bottom-wrap flex justify-center">
			<view class="f-18 orange fontBold" >
				销售业绩：￥{{info.sales_performance||0}}
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id:0,
				chef_str:'',
				info:{}
			}
		},
		onLoad(option) {
			if(option.id){
				this.id = option.id;
				this.getInfo();
			}
		},
		methods: {
			preImg(urls,current){
				uni.previewImage({
					urls,
					current
				})
			},
			getInfo(){
				let data = {
					shop_id:this.id
				}
				this.$http('/apimanager/shop_manager/shopInfo',data).then(res=>{
					if(res.code == 200){
						let datas = res.data;
						this.info = datas.info;
						this.chef = datas.chef;
						let arr = [];
						this.chef.forEach(item=>{
							arr.push(item.name);
						})
						this.chef_str = arr.join('/');
					}
				})
			},
		}
	}
</script>

<style lang="less">
	page{
		overflow-x: hidden;
	}
	.circle-orange {
		width: 650px;
		height: 620px;
		background: #FF5200;
		border-radius: 50%;
		position: absolute;
		top: -340px;
		left: 50%;
		transform: translateX(-50%);
		overflow: hidden;
	}
	.top-img{
		height: 600rpx;
		border-radius: 30rpx;
		width: 100%;
	}
	.restaurant-desc{
		background: rgba(255,255,255,0.9);
		box-shadow: 0px 0px 16px rgba(0,0,0,0.05);
		border-radius: 16rpx;
		padding: 20rpx 30rpx;
		margin-top: -110rpx;
		position: relative;
		z-index: 2;
	}
	.local{
		width: 24rpx;
		height: 24rpx;
	}
	.wrap{
		background: #FFFFFF;
		box-shadow: 0px 0px 16px rgba(0,0,0,0.05);
		border-radius: 16rpx;
		padding: 20rpx;
	}
	.bottom-wrap {
		box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.07);
		border-radius: 20px 20px 0 0;
		height: 130rpx;
		position: fixed;
		bottom: 0;
		left: 0;
		z-index: 100;
		background: #ffffff;
		width: 100%;
		padding: 20rpx 30rpx 0 30rpx;
	}
</style>
